<template>
    <div class="_background:primary-shade-150!">Primary Shade 15%</div>

    <div class="_background:primary-shade-100!">Primary Shade 10%</div>

    <div class="_background:primary-shade-50!">Primary Shade 5%</div>

    <div class="_background:primary!">Primary</div>

    <div class="_background:primary-tint-50!">Primary Tint 5%</div>

    <div class="_background:primary-tint-100!">Primary Tint 10%</div>

    <div class="_background:primary-tint-150!">Primary Tint 15%</div>

    <hr />

    <div class="_background:primary-50!">Primary 5%</div>

    <div class="_background:primary-100!">Primary 10%</div>

    <div class="_background:primary-200!">Primary 20%</div>

    <div class="_background:primary-300!">Primary 30%</div>

    <div class="_background:primary-400!">Primary 40%</div>

    <div class="_background:primary-500!">Primary 50%</div>

    <div class="_background:primary-600!">Primary 60%</div>

    <div class="_background:primary-700!">Primary 70%</div>

    <div class="_background:primary-800!">Primary 80%</div>

    <div class="_background:primary-900!">Primary 90%</div>
</template>
